<!--
 * @Date: 2019-12-13 16:45:24
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2020-05-12 11:03:27
 * @describe: -房源详情-基本信息-
 -->
<template>
  <div class="HousingHomeLease">
    <el-row>
      <el-col :span="9">
        <div class="Properties">
          <div class="PropertiesIMG">
            <img v-if="LPimg" :src="LPimg" alt />
            <div v-else class="colorGray LPimgNull">图片拍摄中</div>
          </div>
          <div class="PropertiesName">
            <div class="marg_t15 fontColor1">
              楼盘名称：
              <el-button type="text" @click="goDict(dataForm.dictId)">{{dataForm.dictName}}</el-button>
              <!-- <span>{{dataForm.dictName}}</span> -->
            </div>
            <div class="marg_t15 fontColor1">
              房源编号：
              <span>{{"FY - "+HousingID.substring(HousingID.length-6)}}</span>
            </div>
            <div class="marg_t15">
              <el-tag class="marg_r10">{{ $getDictLabel("dictType",dataForm.type)}}</el-tag>
              <el-tag class="marg_r10">{{ $Dictionaries("CityRegion",dataForm.districtCode) }}</el-tag>
            </div>
          </div>
        </div>
      </el-col>
      <el-col :span="5">
        <div class="marg_t15 fontColor1" v-if="this.type == '0'">
          房号：
          <span>{{dataForm.zdNum}}{{dataForm.zdUnit}}-{{dataForm.dyNum}}单元-{{ dataForm.num}}</span>
        </div>
        <div class="marg_t15 fontColor1" v-else>
          户型：
          <span>{{dataForm.apartmentS}}室 {{dataForm.apartmentT}}厅 {{dataForm.apartmentW}}卫 {{dataForm.apartmentY}}阳台</span>
        </div>
        <div class="marg_t15 fontColor1">
          面积：
          <span>{{dataForm.area}}㎡</span>
        </div>
      </el-col>
      <el-col :span="5">
        <div class="marg_t15 fontColor1">
          总价：
          <span>{{dataForm.prices}} {{transactionType=='0'?'万元':'元/月'}}</span>
        </div>
        <div class="marg_t15 fontColor1">
          单价：
          <span>{{dataForm.price}} {{transactionType=='0'?'元/m²':'元/月'}}</span>
        </div>
      </el-col>
      <el-col :span="5">
        <div class="marg_t15 fontColor1">
          来源：
          <span>{{$getDictLabel("houseSource",dataForm.source)}}</span>
        </div>
        <div class="marg_t15 fontColor1" v-if="Number(type) == 0">
          税收：
          <span>{{$getDictLabel("houseTaxation",dataForm.taxation)}}</span>
        </div>

        <!-- <div class="marg_t15 fontColor1">
          {{$getDictLabel("houseSortType",dataForm.sortType)?$getDictLabel("houseSortType",dataForm.sortType):'' +'姓名：'}}
          <span>{{dataForm.ownerName}} &nbsp;</span>
          <el-popover
            placement="bottom"
            width="200"
            trigger="click"
            :content="'手机号码：'+dataForm.ownerPhone1+'\n'+dataForm.ownerPhone2+'\n'+dataForm.ownerPhone3"
          >
            <el-button slot="reference" type="text" icon="el-icon-user" @click="Viewlinks">查看联系方式</el-button>
          </el-popover>
        </div>-->
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12" style="padding-right:7px;">
        <div class="HomeLease_infoBox">
          <div slot="header" class="clearfix">
            <span class="card_title">房源信息</span>
            <span v-if="transactionType=='0'" class="signType">售</span>
            <span v-else class="signType1">租</span>
            <span v-if="dataForm.commonState=='2'" class="signType">私</span>
            <span v-else class="signType1">公</span>
            <el-tag
              size="small"
              style="margin-left:10px"
              v-if="dataForm.sortType"
            >{{$getDictLabel("houseSortType",dataForm.sortType)}}</el-tag>
          </div>
          <div class="fontColor1">
            <ul class="parameter_ul">
              <li class="list_background">
                <div class="parameter_l">
                  <span class="parameter_span">格局：</span>
                  <span>{{dataForm.apartmentB}}办公室 {{dataForm.apartmentH}}会议室 {{dataForm.apartmentG}}工位</span>
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">装修：</span>
                  <span>{{ $getDictLabel("dictRenovation",dataForm.renovation)}}</span>
                  <!--  <span class="parameter_span">房号：</span>
                  <span>{{dataForm.zdNum+' '+dataForm.zdUnit+' '+dataForm.dyNum+'单元 '+dataForm.num}}</span>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <span class="parameter_span">朝向：</span>
                  <span>{{dataForm.direction}}</span>
                  <!--<span class="parameter_span">楼层：</span>
                  <span>{{dataForm.storeyCoordinate}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">看房方式：</span>
                  <span>{{$getDictLabel("dictLookMode",dataForm.lookMode)}}</span>
                  <!-- <span class="parameter_span">总层：</span>
                  <span>{{dataForm.storey}}</span>-->
                </div>
              </li>
              <li class="list_background">
                <div class="parameter_l">
                  <span class="parameter_span">付款方式：</span>
                  <span
                    v-if="transactionType=='0'"
                  >{{$getDictLabel("dictOwnerBuy",dataForm.paytype)}}</span>
                  <span
                    v-if="transactionType=='1'"
                  >{{$getDictLabel("dictTenanPay",dataForm.tenanPay)}}</span>
                  <!--   <span class="parameter_span">类型：</span>
                  <span>{{$getDictLabel("houseType",dataForm.houseType)}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">钥匙：</span>
                  <span>{{dataForm.key1=='0'?'没有':'有'}}</span>
                  <!-- <span class="parameter_span">现状：</span>
                  <span>{{$getDictLabel("dictSituation",dataForm.situation)}}</span>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <div v-if="transactionType=='0'">
                    <span class="parameter_span">首付：</span>
                    <span>{{dataForm.payments}}</span>
                  </div>
                  <div v-else-if="transactionType=='1'">
                    <span class="parameter_span">合同年限：</span>
                    <span>{{dataForm.tenanTime}} &nbsp;年</span>
                  </div>
                  <!--     <span class="parameter_span">付款方式：</span>
                  <span
                    v-if="transactionType=='0'"
                  >{{$getDictLabel("dictOwnerBuy",dataForm.paytype)}}</span>
                  <span
                    v-if="transactionType=='1'"
                  >{{$getDictLabel("dictTenanPay",dataForm.tenanPay)}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">佣金：</span>
                  <span>{{dataForm.servicePrice}}&nbsp;元</span>
                  <!--    <div v-if="transactionType=='0'">
                    <span class="parameter_span">贷款银行：</span>
                    <span>{{$getDictLabel("houseBank",dataForm.loanBank)}}</span>
                  </div>
                  <div v-else-if="transactionType=='1'">
                    <span class="parameter_span">租赁方式：</span>
                    <span>{{ $getDictLabel("houseLeaseType",dataForm.leaseType)}}</span>
                  </div>-->
                </div>
              </li>
              <li class="list_background">
                <div class="parameter_l">
                  <div v-if="transactionType=='1'">
                    <span class="parameter_span">递增：</span>
                    <span>{{dataForm.increase}} &nbsp;%</span>
                  </div>
                  <div v-else-if="transactionType=='0'">
                    <span class="parameter_span">抵押情况：</span>
                    <span>{{dataForm.buyBill=='0'?'没有':'有'}}</span>
                  </div>
                  <!--   <div v-if="transactionType=='1'">
                    <span class="parameter_span">看房方式：</span>
                    <span>{{$getDictLabel("dictLookMode",dataForm.lookMode)}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'">
                    <span class="parameter_span">贷款金额：</span>
                    <span>{{dataForm.loanPrice}} &nbsp;万元</span>
                  </div>-->
                </div>
                <div class="parameter_r">
                  <div v-if="transactionType=='1'">
                    <span class="parameter_span">免租：</span>
                    <span>{{dataForm.tenanFreeTime}} &nbsp;天</span>
                  </div>
                  <div v-else-if="transactionType=='0'">
                    <span class="parameter_span">抵押日期：</span>
                    <span>{{dataForm.mortgageDate}}</span>
                  </div>
                  <!--    <div v-if="transactionType=='1'">
                    <span class="parameter_span">看房时间：</span>
                    <span>{{$getDictLabel("houseSeeTime",dataForm.seeTime)}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'">
                    <span class="parameter_span">发票：</span>
                    <span>{{dataForm.buyBill=='0'?'没有':'有'}}</span>
                  </div>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <div v-if="transactionType=='0'">
                    <span class="parameter_span">抵押金额：</span>
                    <span>{{dataForm.loanPrice}} &nbsp;万元</span>
                  </div>
                  <!--     <div v-if="transactionType=='1'">
                    <span class="parameter_span">入住时间：</span>
                    <span>{{$getDictLabel("houseInTime",dataForm.inTime)}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">能否注册：</span>
                    <span>{{dataForm.register=='0'?'不能':'能'}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">房本备件：</span>
                    <span>{{dataForm.premisesPermit}}</span>
                  </div>-->
                </div>
                <div class="parameter_r">
                  <div v-if="transactionType=='0'">
                    <span class="parameter_span">抵押银行：</span>
                    <span>{{$getDictLabel("houseBank",dataForm.loanBank)}}</span>
                  </div>
                  <!--   <div v-if="transactionType=='1'">
                    <span class="parameter_span">递增：</span>
                    <span>{{dataForm.increase}} &nbsp;%</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">房本备件：</span>
                    <span>{{dataForm.premisesPermit}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">房屋年限：</span>
                    <span>{{dataForm.housingLife}}</span>
                  </div>-->
                </div>
              </li>
              <li class="list_background">
                <div class="parameter_l">
                  <div if="transactionType=='0'">
                    <span class="parameter_span">发票：</span>
                    <span>{{dataForm.buyBill=='0'?'没有':'有'}}</span>
                  </div>
                  <!--  <div v-if="transactionType=='1'">
                    <span class="parameter_span">押金：</span>
                    <span>{{dataForm.deposit}}&nbsp;元</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">能否清场：</span>
                    <span>{{dataForm.clearance=='0'?'不能':'能'}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">抵押：</span>
                    <span>{{dataForm.mortgage}}</span>
                  </div>-->
                </div>
                <div class="parameter_r">
                  <!--     <div v-if="transactionType=='1'">
                    <span class="parameter_span">佣金：</span>
                    <span>{{dataForm.servicePrice}}&nbsp;元</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">房屋年限：</span>
                    <span>{{dataForm.housingLife}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">上次交易：</span>
                    <span>{{dataForm.lastTransaction}}</span>
                  </div>-->
                </div>
              </li>
              <!-- <li>
                <div class="parameter_l">
                  <div v-if="transactionType=='1'">
                    <span class="parameter_span">起租：</span>
                    <span>{{dataForm.tenanTime}} &nbsp;月</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">抵押：</span>
                    <span>{{dataForm.mortgage}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">产权所属：</span>
                    <span>{{dataForm.property}}</span>
                  </div>
                </div>
                <div class="parameter_r">
                 <div v-if="transactionType=='1'">
                    <span class="parameter_span">免租：</span>
                    <span>{{dataForm.tenanFreeTime}} &nbsp;天</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">上次交易：</span>
                    <span>{{dataForm.lastTransaction}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='1'||transactionType=='0'&&type=='2'">
                    <span class="parameter_span">下证日期：</span>
                    <span>{{dataForm.evidenceDate}}</span>
                  </div>
                </div>
              </li>-->
              <!-- <li class="list_background" v-if="transactionType=='0'&&type=='0'">
                <div class="parameter_l">
                  <span class="parameter_span">产权所属：</span>
                  <span>{{dataForm.property}}</span>
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">下证日期：</span>
                  <span>{{dataForm.evidenceDate}}</span>
                </div>
              </li>-->

              <li>
                <div style="padding-left:15px;">
                  <span class="parameter_span">标题：</span>
                  <span>{{dataForm.title}}</span>
                </div>
              </li>
            </ul>
          </div>
        </div>
      </el-col>

      <el-col :span="12">
        <div class="HomeLease_infoBox">
          <div slot="header" class="clearfix">
            <span class="card_title">基本信息</span>
          </div>
          <div class="fontColor1">
            <ul class="parameter_ul">
              <li class="list_background">
                <div class="parameter_l">
                  <span class="parameter_span">家具：</span>
                  <span>{{dataForm.furniture=='0'?'没有':'有'}}</span>
                  <!--<span class="parameter_span">钥匙：</span>
                  <span>{{dataForm.key1=='0'?'没有':'有'}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">物业：</span>
                  <span>{{dataForm.propertyPrice+'元/月'}}</span>
                  <!-- <span class="parameter_span">入住：</span>
                  <span>{{dataForm.inTime}}</span>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <span class="parameter_span">能否注册：</span>
                  <span>{{dataForm.register=='0'?'不能':'能'}}</span>
                  <!--<span class="parameter_span">归属：</span>
                  <span>{{$getDictLabel("ascription",dataForm.ascription)}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">通上下水：</span>
                  <span>{{$getDictLabel("houseWater",dataForm.water)}}</span>
                  <!-- <span class="parameter_span">权属：</span>
                  <span>{{$getDictLabel("houseTrading",dataForm.trading)}}</span>-->
                </div>
              </li>

              <li class="list_background">
                <div class="parameter_l">
                  <span class="parameter_span">房屋现状：</span>
                  <span>{{$getDictLabel("dictSituation",dataForm.situation)}}</span>
                  <!-- <span class="parameter_span">物业：</span>
                  <span>{{dataForm.propertyPrice+'元/月'}}</span>-->
                </div>
                <div class="parameter_r">
                  <div v-if="transactionType=='1'">
                    <span class="parameter_span">入住时间：</span>
                    <span>{{$getDictLabel("houseInTime",dataForm.inTime)}}</span>
                  </div>
                  <div v-else-if="transactionType=='0'&&type=='0'">
                    <span class="parameter_span">能否清场：</span>
                    <span>{{dataForm.clearance=='0'?'不能':'能'}}</span>
                  </div>
                  <!--<span class="parameter_span">装修：</span>
                  <span>{{ $getDictLabel("dictRenovation",dataForm.renovation)}}</span>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <span class="parameter_span">房源归类：</span>
                  <span>{{$getDictLabel("houseSortType",dataForm.sortType)}}</span>
                  <!--  <span class="parameter_span">电梯：</span>
                  <span>{{dataForm.lift=='0'?'没有':'有'}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">房屋状态：</span>
                  <span>{{$getDictLabel("dictState",dataForm.state)}}</span>
                  <!-- <span class="parameter_span">梯户比：</span>
                  <span>{{dataForm.liftRoom}}</span>-->
                </div>
              </li>
              <li class="list_background">
                <div class="parameter_l">
                  <span class="parameter_span">房屋来源：</span>
                  <span>{{$getDictLabel("houseSource",dataForm.source)}}</span>
                  <!--<span class="parameter_span">供暖：</span>
                  <span>{{$getDictLabel("houseHeating",dataForm.heating)}}</span>-->
                </div>
                <div class="parameter_r">
                  <span class="parameter_span">房屋类型：</span>
                  <span>{{$getDictLabel("houseType",dataForm.source)}}</span>
                  <!--<span class="parameter_span">供水：</span>
                  <span>{{$getDictLabel("houseWater",dataForm.water)}}</span>-->
                </div>
              </li>
              <li>
                <div class="parameter_l">
                  <span class="parameter_span">空调情况：</span>
                  <span>{{$getDictLabel("houseHeating",dataForm.heating)}}</span>
                </div>
                <div class="parameter_r">
                  <div if="transactionType=='0'">
                    <span class="parameter_span">产权日期：</span>
                    <span>{{dataForm.evidenceDate}}</span>
                  </div>
                  <!--  <div if="transactionType=='0'">
                    <span class="parameter_span">抵押日期：</span>
                    <span>{{dataForm.mortgageDate}}</span>
                  </div>-->
                </div>
              </li>
              <li class="list_background">
                <div class="parameter_l">
                  <div if="transactionType=='0'">
                    <span class="parameter_span">证件：</span>
                    <span>{{$getDictLabel("houseProperty",dataForm.property)}}</span>
                  </div>
                </div>
                <div class="parameter_r"></div>
              </li>
              <li>
                <div v-if="transactionType=='1'&&type=='1'||transactionType=='1'&&type=='2'">
                  <div class="parameter_l">
                    <span class="parameter_span">供电：</span>
                    <span>{{$getDictLabel("housePower",dataForm.power)}}</span>
                  </div>
                  <div class="parameter_r">
                    <span class="parameter_span">供气：</span>
                    <span>{{dataForm.gas=='0'?'没有':'有'}}</span>
                  </div>
                </div>
              </li>
              <!-- <li>
                <div style="padding-left:15px;">
                  <span class="parameter_span">描述：</span>
                  <span>{{dataForm.description}}</span>
                </div>
              </li>-->
            </ul>
          </div>
        </div>
      </el-col>
    </el-row>
    <div class="box_shadow" style="margin:0px 5px;padding:5px 0px">
      <span class="card_title">配套设施：</span>
      <span class="display_i_b" style="margin-left:10px">
        <el-checkbox-group v-model="confList" disabled>
          <el-checkbox
            :label="item.dictValue"
            v-for="(item,index) in $getDictDataList('dictConf')"
            :key="index"
          >{{item.dictLabel}}</el-checkbox>
        </el-checkbox-group>
      </span>
    </div>
    <div class="box_shadow" style="margin:20px 5px">
      <span class="card_title">备注：</span>
      <span class="display_i_b" style="margin-left:10px">{{dataForm.remark}}</span>
    </div>

    <div
      class="Follow_main box_shadow"
      style="margin:20px 5px"
      v-if="hasPermissionInfo('house:houseinfofollow:info')&&$hasPermission('house:houseinfofollow:info')"
    >
      <div>
        <span class="card_title">跟进记录</span>
        <span
          class="float_r"
          style="margin:10px;"
          v-if="hasPermissionInfo('house:houseinfofollow:save')&&$hasPermission('house:houseinfofollow:save')"
        >
          <el-button type="primary" icon="el-icon-edit" plain @click="addFollowFun">写跟进</el-button>
        </span>
      </div>
      <div class="Follow_List">
        <ul>
          <li v-for="item in FollowTableData">
            <el-avatar
              :size="45"
              src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
            ></el-avatar>
            <span class="display_i_b content_text">
              {{item.creatorName}}
              <br />
              {{item.content}}
            </span>
            <span class="float_r date">{{item.createDate }}</span>
          </li>
        </ul>
      </div>
      <el-pagination
        :current-page="page2"
        :page-size="limit2"
        :total="total2"
        layout="total, prev, pager, next, jumper"
        @size-change="pageSizeChangeHandle2"
        @current-change="pageCurrentChangeHandle2"
      ></el-pagination>
    </div>

    <div class="box_shadow" style="margin:10px 5px;padding:0px 8px">
      <el-row>
        <el-col :span="12">
          <span class="card_title" style="width:180px;">房源图片</span>
          <el-radio-group v-model="FYimgviewType" @change="getimg">
            <el-radio
              :label="1"
              v-if="hasPermissionInfo('house:houseinfoimage1:page')&&$hasPermission('house:houseinfoimage1:page')"
            >房源图</el-radio>
            <el-radio
              :label="2"
              v-if="hasPermissionInfo('house:houseinfoimage2:page')&&$hasPermission('house:houseinfoimage2:page')"
            >备件图</el-radio>
            <el-radio
              :label="3"
              v-if="hasPermissionInfo('house:houseentrustimage:page')&&$hasPermission('house:houseentrustimage:page')"
            >委托协议图</el-radio>
            <el-radio
              :label="4"
              v-if="hasPermissionInfo('house:housevideo:page')&&$hasPermission('house:housevideo:page')"
            >房源视频</el-radio>
          </el-radio-group>
        </el-col>
        <span class="float_r" style="margin:10px;">
          <el-button
            type="primary"
            v-if="FYimgviewType==4&&hasPermissionInfo('house:housevideo:upload')"
            @click="UploadVideo"
          >上传视频</el-button>
          <el-button
            type="primary"
            v-else-if="FYimgviewType==1&&hasPermissionInfo('house:houseinfoimage1:upload')"
            @click="UploadImg"
          >上传图片</el-button>
          <el-button
            type="primary"
            v-else-if="FYimgviewType==2&&hasPermissionInfo('house:houseinfoimage2:upload')"
            @click="UploadImg"
          >上传图片</el-button>

          <el-button
            type="primary"
            v-if="FYimgviewType==1&&hasPermissionInfo('house:houseinfoimage1:delete')"
            @click="deleteImage"
          >批量删除</el-button>
          <el-button
            type="primary"
            v-if="FYimgviewType==2&&hasPermissionInfo('house:houseinfoimage2:delete')"
            @click="deleteImage"
          >批量删除</el-button>
          <el-button
            type="primary"
            @click="deleteImage"
            v-if="FYimgviewType==3&&hasPermissionInfo('house:houseentrustimage:delete')"
          >批量删除</el-button>
          <el-button
            type="primary"
            v-if="FYimgviewType==4&&hasPermissionInfo('house:housevideo:delete')"
            @click="deleteImage"
          >批量删除</el-button>

          <el-button
            type="primary"
            v-if="FYimgviewType==1&&hasPermissionInfo('house:houseinfoimage1:download')"
            @click="downloadImage"
          >批量下载</el-button>
          <el-button
            type="primary"
            v-if="FYimgviewType==2&&hasPermissionInfo('house:houseentrustimage:download')"
            @click="downloadImage"
          >批量下载</el-button>
          <el-button
            type="primary"
            @click="downloadImage"
            v-if="FYimgviewType==3&&hasPermissionInfo('house:houseentrustimage:delete')"
          >批量下载</el-button>
          <el-button
            type="primary"
            v-if="FYimgviewType==4&&hasPermissionInfo('house:housevideo:download')"
            @click="downloadImage"
          >批量下载</el-button>
        </span>
      </el-row>
      <div class="VideoList" v-if="FYimgviewType==4">
        <div v-if="imglist.length<1" class="svgColor2 lih33 marg_t15">暂无</div>
        <el-checkbox-group v-if="!MaintainType" v-model="checkList" class="House_img_check">
          <el-checkbox :label="item.id" v-for="(item,index) in imglist" :key="index" :value="item">
            <div class="checkbox_div">
              <!-- <el-image :src="item.url" :preview-src-list="getSrcList(index)"></el-image> -->
              <video
                class="checkbox_video"
                controls="controls"
                muted
                :src="item.url"
              >您的浏览器不支持 video 标签。</video>
            </div>
            <span class="colorGray float_l">{{item.title}}</span>
            <span class="colorGray float_r">--{{item.maintainName}}</span>
            <br />
            <span class="colorGray float_l">{{$getDictLabel("examine",item.examine)}}</span>
            <span class="Imgedit float_r" @click="ImgeditClick(item)">
              <svg class="icon-svg svgColor3 svgStyle2" aria-hidden="true">
                <use xlink:href="#edit2" />
              </svg>
            </span>
          </el-checkbox>
        </el-checkbox-group>
        <ul v-else>
          <li v-for="(item,index) in imglist" class="House_img_li" :key="index">
            <div class="House_img_li_div">
              <video
                class="checkbox_video"
                controls="controls"
                muted
                :src="item.url"
              >您的浏览器不支持 video 标签。</video>
            </div>
            <div class="House_img_li_title martop5">
              <span class="colorGray float_l">{{item.title}}</span>
              <span class="colorGray float_r">--{{item.maintainName}}</span>
            </div>
            <span class="colorGray float_l">{{$getDictLabel("examine",item.examine)}}</span>
          </li>
        </ul>
      </div>
      <div class="LP_imgList martop10" v-else>
        <div v-if="imglist.length<1" class="svgColor2 lih33 marg_t15">暂无</div>
        <el-checkbox-group v-if="MaintainType" v-model="checkList" class="House_img_check">
          <el-checkbox :label="item.id" v-for="(item,index) in imglist" :key="index" :value="item">
            <div class="checkbox_div">
              <el-image :src="item.url" :preview-src-list="getSrcList(index)"></el-image>
            </div>
            <span class="colorGray float_l">{{item.title}}</span>
            <span class="colorGray float_r">--{{item.maintainName}}</span>
            <br />
            <span class="colorGray float_l">{{$getDictLabel("examine",item.examine)}}</span>
            <span class="Imgedit float_r" @click="ImgeditClick(item)">
              <svg class="icon-svg svgColor3 svgStyle2" aria-hidden="true">
                <use xlink:href="#edit2" />
              </svg>
            </span>
          </el-checkbox>
        </el-checkbox-group>
        <ul v-else>
          <li v-for="(item,index) in imglist" class="House_img_li" :key="index">
            <div class="House_img_li_div">
              <el-image :src="item.url" :preview-src-list="getSrcList(index)"></el-image>
            </div>
            <div class="House_img_li_title martop5">
              <span class="colorGray float_l">{{item.title}}</span>
              <span class="colorGray float_r">--{{item.maintainName}}</span>
            </div>
            <span class="colorGray float_l">{{$getDictLabel("examine",item.examine)}}</span>
          </li>
        </ul>
      </div>
    </div>

    <el-dialog title="上传房源图片" :visible.sync="FYdialogVisible" width="30%" :destroy-on-close="true">
      <el-form ref="form" :model="FYimgUploadFrom" label-width="50px" label-position="top">
        <el-form-item label="类型">
          <el-radio-group v-model="FYimgUploadFrom.imageType">
            <el-radio
              :label="1"
              v-if="hasPermissionInfo('house:houseinfoimage1:upload')&&$hasPermission('house:houseinfoimage1:upload')"
            >房源图</el-radio>
            <el-radio
              :label="2"
              v-if="hasPermissionInfo('house:houseinfoimage2:upload')&&$hasPermission('house:houseinfoimage2:upload')"
            >房东产权图</el-radio>
            <el-radio
              :label="3"
              v-if="hasPermissionInfo('house:houseinfoimage2:upload')&&$hasPermission('house:houseinfoimage2:upload')"
            >房东身份证/营业执照图</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="备注">
          <el-autocomplete
            v-if="Number(type) == 0"
            class="inline-input"
            v-model="FYimgUploadFrom.title"
            :fetch-suggestions="querySearch"
            placeholder="请输入内容"
            style="width:100%"
          ></el-autocomplete>
          <el-input v-else v-model="FYimgUploadFrom.title"></el-input>
        </el-form-item>
        <el-form-item label="选择图片">
          <el-upload
            class="upload-demo"
            ref="FJupload"
            action="/project/projectinfo/apartmentUpload"
            :file-list="fileListFY"
            :auto-upload="false"
            :limit="10"
            list-type="picture-card"
            :multiple="true"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="FYdialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="FJuploadFun" :loading="BtnLoading">点击上传</el-button>
      </span>
    </el-dialog>

    <el-dialog
      title="上传房源视频"
      :visible.sync="UploadVideoDialog"
      width="30%"
      :destroy-on-close="true"
    >
      <el-form ref="form" :model="UploadVideoFrom" label-width="50px" label-position="top">
        <el-form-item label="备注">
          <el-input v-model="UploadVideoFrom.title"></el-input>
        </el-form-item>
        <el-form-item label="选择视频">
          <el-upload
            class="upload-demo"
            ref="Videoupload"
            :file-list="VideofileList"
            :limit="3"
            drag
            action="/house/houseinfo/videoupload"
            :auto-upload="false"
            :multiple="true"
          >
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">
              将文件拖到此处，或
              <em>点击上传</em>
            </div>
          </el-upload>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="UploadVideoDialog = false">取 消</el-button>
        <el-button type="primary" @click="UploadVideoFun" :loading="BtnLoading">点击上传</el-button>
      </span>
    </el-dialog>

    <addFollow ref="addFollow"></addFollow>
    <houseimageaddorupdate ref="imageUpdate"></houseimageaddorupdate>
  </div>
</template>
<script>
import addFollow from "./addFollow";
import houseimageaddorupdate from "./houseimage-add-or-update";
export default {
  name: "",
  data() {
    return {
      MaintainType: true,
      AxiosUrl: "",
      inputState: true,
      dataForm: {
        name: "",
        id: ""
      },
      activeName: "first",
      LPimg: "",
      metroList: [],
      confList: [],
      FollowTableData: [],
      page2: 1, // 当前页码
      limit2: 5, // 每页数
      total2: 0, // 总条数

      checkList: [], //图片选中数组
      imglist: [], //图片显示数组
      previewImglist: [], //预览图片数组

      checkList2: [], //图片选中数组2
      imglist2: [], //图片显示数组2
      previewImglist2: [], //预览图片数组2

      checkList3: [], //图片选中数组3
      imglist3: [], //图片显示数组3
      previewImglist3: [], //预览图片数组3

      fileList: [],
      FYdialogVisible: false,
      FYimgUploadFrom: {
        title: "",
        imageType: "1" //图片上传类型
      },
      fileListFY: [],
      BtnLoading: false,
      FYimgviewType: 1,
      UploadVideoDialog: false,
      UploadVideoFrom: {
        title: ""
      },
      VideofileList: [],
      restaurants: [
        {
          value: "户型图"
        },
        {
          value: "办公室"
        },
        {
          value: "大厅"
        },
        {
          value: "会议室"
        },
        {
          value: "培训室"
        },
        {
          value: "财务室"
        },
        {
          value: "老总室"
        },
        {
          value: "经理室"
        }
      ]
    };
  },
  props: ["HousingID", "transactionType", "type"],
  components: {
    addFollow,
    houseimageaddorupdate
  },
  created() {
    this.getAll();
  },
  mounted() {},
  methods: {
    getAll() {
      if (this.HousingID) {
        if (this.type == "2") {
          //住宅
          if (this.transactionType == "0") {
            //出售
            this.AxiosUrl = "/house/houseinfo/homeSellInfo";
          } else if (this.transactionType == "1") {
            //出租
            this.AxiosUrl = "/house/houseinfo/homeLeaseInfo";
          }
        } else if (this.type == "0") {
          //写字楼
          if (this.transactionType == "0") {
            //出售
            this.AxiosUrl = "/house/houseinfo/officeSellInfo";
          } else if (this.transactionType == "1") {
            //出租
            this.AxiosUrl = "/house/houseinfo/officeLeaseInfo";
          }
        } else if (this.type == "1") {
          //公寓
          if (this.transactionType == "0") {
            //出售
            this.AxiosUrl = "/house/houseinfo/homeSellInfo";
          } else if (this.transactionType == "1") {
            //出租
            this.AxiosUrl = "/house/houseinfo/homeLeaseInfo";
          }
        }
        this.getHomeLease();
        this.getPageFollow();
        this.getimg();
        // this.getimg2();
        // this.getimg3();
      }
    },
    //跳转到列表页
    goDict(row) {
      this.$router.push({
        name: "BuildingDetails",
        query: {
          ID: row
        }
      });
    },
    //获取房源信息
    getHomeLease() {
      let _this = this;
      this.$http
        .get(this.AxiosUrl, {
          params: {
            houseId: _this.HousingID
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.dataForm = res.data;
          // _this.MaintainType = res.data.permission;
          // this.$emit("MaintainType", {
          //   infoUpdate: _this.hasPermissionInfo("house:houseinfo:update"),
          //   AgentUpdate: _this.hasPermissionInfo(
          //     "house:houseinfo:updateHouseAgent"
          //   )
          // });
          // this.$emit("MaintainType", res.data.permissionListDTO);
          this.$emit("getdataFormInfo", res.data);

          if (res.data.conf) {
            _this.confList = res.data.conf.split(",");
          } else {
            _this.confList = [];
          }
        })
        .catch(() => {});
    },

    //获取房源跟进记录
    getPageFollow() {
      let _this = this;
      this.$http
        .get(`/house/housefollow/page`, {
          params: {
            page: _this.page2,
            limit: _this.limit2,
            houseId: _this.HousingID,
            type: 2
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.FollowTableData = res.data.list;
          _this.total2 = res.data.total;
        })
        .catch(() => {});
    },
    // 分页, 每页条数
    pageSizeChangeHandle2(val) {
      this.page2 = 1;
      this.limit2 = val;
      this.getPageFollow();
    },
    // 分页, 当前页
    pageCurrentChangeHandle2(val) {
      this.page2 = val;
      this.getPageFollow();
    },

    //获取房源图片
    getimg() {
      let _this = this;
      _this.imglist = [];
      _this.previewImglist = [];
      let url = "";
      if (_this.FYimgviewType == 3) {
        url = "house/houseentrust/imageList";
      } else if (
        _this.FYimgviewType == 1 ||
        _this.FYimgviewType == 2 ||
        _this.FYimgviewType == 4
      ) {
        url = "/house/houseinfo/imageList";
      } else {
        _this.imglist = [];
        _this.previewImglist = [];
        return;
      }
      this.$http
        .get(url, {
          params: {
            houseId: _this.HousingID,
            imageType: _this.FYimgviewType
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.imglist = res.data;
          if (_this.FYimgviewType == 1) {
            _this.LPimg = _this.imglist[0].url;
          }
          for (let i = 0; i < _this.imglist.length; i++) {
            _this.previewImglist.push(_this.imglist[i].url);
          }
        })
        .catch(() => {});
    },
    //预览图片list
    getSrcList(index) {
      return this.previewImglist
        .slice(index)
        .concat(this.previewImglist.slice(0, index));
    },
    //获取房东图片
    getimg2() {
      let _this = this;
      _this.imglist2 = [];
      _this.previewImglist2 = [];
      this.$http
        .get(`/house/houseinfo/imageList`, {
          params: {
            houseId: _this.HousingID,
            imageType: 2
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.imglist2 = res.data;
          for (let i = 0; i < _this.imglist2.length; i++) {
            _this.previewImglist2.push(_this.imglist2[i].url);
          }
        })
        .catch(() => {});
    },
    //预览图片list
    getSrcList2(index) {
      return this.previewImglist2
        .slice(index)
        .concat(this.previewImglist2.slice(0, index));
    },
    // 获取委托协议图片
    getimg3() {
      let _this = this;
      _this.imglist3 = [];
      _this.previewImglist3 = [];
      this.$http
        .get(`house/houseentrust/imageList`, {
          params: {
            houseId: _this.HousingID
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.imglist3 = res.data;
          for (let i = 0; i < _this.imglist3.length; i++) {
            _this.previewImglist3.push(_this.imglist3[i].url);
          }
        })
        .catch(() => {});
    },
    //预览图片list
    getSrcList3(index) {
      return this.previewImglist3
        .slice(index)
        .concat(this.previewImglist3.slice(0, index));
    },
    //删除房源图片
    deleteImage() {
      let _this = this;
      if (_this.FYimgviewType == 3) {
        if (!this.hasPermissionInfo("house:houseentrustimage:delete")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 1) {
        if (!this.hasPermissionInfo("house:houseinfoimage1:delete")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 2) {
        if (!this.hasPermissionInfo("house:houseinfoimage2:delete")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 4) {
        if (!this.hasPermissionInfo("house:housevideo:delete")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      }
      if (_this.checkList.length < 1) {
        this.$message({
          type: "info",
          message: "请选择要删除的图片"
        });
        return;
      }
      this.$confirm("您将批量删除选中的图片, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$http
            .post(
              `/house/houseinfo/deleteImage`,
              {},
              {
                params: {
                  ids: _this.checkList.join()
                }
              }
            )
            .then(({ data: res }) => {
              if (res.code !== 0) {
                return this.$message.error(res.msg);
              }
              _this.$message.success("删除成功！");
              _this.checkList = [];
              _this.getimg();
            })
            .catch(() => {});
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    //批量下载房源图片
    downloadImage() {
      let _this = this;
      let url = "";
      if (_this.FYimgviewType == 3) {
        url = "/house/houseentrust/downloadimage";
        if (!this.hasPermissionInfo("house:houseentrustimage:download")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 1) {
        url = "/house/houseimage/downloadimage1";
        if (!this.hasPermissionInfo("house:houseinfoimage1:download")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 2) {
        url = "/house/houseimage/downloadimage2";
        if (!this.hasPermissionInfo("house:houseinfoimage2:download")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 4) {
        url = "/house/houseimage/downloadvideo";
        if (!this.hasPermissionInfo("house:housevideo:download")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      }
      if (_this.checkList.length < 1) {
        this.$message({
          type: "info",
          message: "请选择要下载的图片"
        });
        return;
      }
      let allurl =
        window.SITE_CONFIG["apiURL"] + url + "?ids=" + _this.checkList.join();
      let a = document.createElement("a");
      a.setAttribute("href", allurl);
      a.click();
      // this.$http
      //   .post(
      //     url,
      //     {},
      //     {
      //       params: {
      //         ids: _this.checkList.join()
      //       }
      //     }
      //   )
      //   .then(({ data: res }) => {
      //     if (res.code !== 0) {
      //       return this.$message.error(res.msg);
      //     }
      //   })
      //   .catch(() => {});
    },
    //文件限制个数
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 1 个文件，本次选择了 ${
          files.length
        } 个文件，共选择了 ${files.length + fileList.length} 个文件`
      );
    },

    //点击上传房间图片
    UploadImg() {
      this.fileListFY = [];
      this.FYimgUploadFrom = {
        title: "",
        imageType: this.FYimgviewType //图片上传类型
      };
      this.FYdialogVisible = true;
    },

    //确定上传房间图片
    FJuploadFun() {
      let _this = this;
      if (this.FYimgUploadFrom.imageType == 1) {
        if (!this.hasPermissionInfo("house:houseinfoimage1:upload")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (this.FYimgUploadFrom.imageType == 2) {
        if (!this.hasPermissionInfo("house:houseinfoimage2:upload")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (this.FYimgUploadFrom.imageType == 3) {
        if (!this.hasPermissionInfo("house:houseinfoimage2:upload")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      }
      _this.BtnLoading = true;
      let formData = new FormData();
      for (let i = 0; i < this.$refs.FJupload.uploadFiles.length; i++) {
        formData.append("files", this.$refs.FJupload.uploadFiles[i].raw);
      }
      this.$http
        .post("/house/houseinfo/upload", formData, {
          params: {
            houseId: _this.HousingID,
            title: _this.FYimgUploadFrom.title,
            imageType: _this.FYimgUploadFrom.imageType
          }
        })
        .then(({ data: res }) => {
          _this.BtnLoading = false;
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.$message.success("上传成功！");
          _this.FYdialogVisible = false;
          _this.getimg();
        })
        .catch(() => {});
    },

    //写跟进
    addFollowFun() {
      this.$nextTick(() => {
        this.$refs.addFollow.FollowForm = {
          houseId: this.HousingID,
          fjId: this.dataForm.fjId,
          content: "",
          type: ""
        };
        this.$refs.addFollow.init();
      });
    },

    //编辑图片
    ImgeditClick(item) {
      let _this = this;
      if (_this.FYimgviewType == 3) {
        if (!this.hasPermissionInfo("house:houseentrustimage:update")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 1) {
        if (!this.hasPermissionInfo("house:houseinfoimage1:update")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 2) {
        if (!this.hasPermissionInfo("house:houseinfoimage2:update")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      } else if (_this.FYimgviewType == 4) {
        if (!this.hasPermissionInfo("house:housevideo:update")) {
          this.$message({
            type: "info",
            message: "没有权限"
          });
          return;
        }
      }

      this.$nextTick(() => {
        this.$refs.imageUpdate.dataForm.id = item.id;
        this.$refs.imageUpdate.init();
      });
    },
    //判断操作权限
    hasPermissionInfo(val) {
      let _this = this;
      let arr = _this.dataForm.permissionListDTO;
      if (arr && arr != []) {
        for (let i = 0; i < arr.length; i++) {
          const element = arr[i];
          if (element.permission.indexOf(val) != -1 && element.state == true) {
            return true;
          }
        }
      } else {
        return false;
      }
    },

    //点击上传视频
    UploadVideo() {
      this.UploadVideoFrom = {
        title: ""
      };
      this.VideofileList = [];
      this.UploadVideoDialog = true;
    },
    //确定上传房源视频
    UploadVideoFun() {
      let _this = this;
      _this.BtnLoading = true;
      let formData = new FormData();
      for (let i = 0; i < this.$refs.Videoupload.uploadFiles.length; i++) {
        formData.append("files", this.$refs.Videoupload.uploadFiles[i].raw);
      }
      this.$http
        .post("/house/houseinfo/videoupload", formData, {
          params: {
            houseId: _this.HousingID,
            title: _this.UploadVideoFrom.title
          }
        })
        .then(({ data: res }) => {
          _this.BtnLoading = false;
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.$message.success("上传成功！");
          _this.UploadVideoDialog = false;
          _this.getimg();
        })
        .catch(() => {});
    },

    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    }
  },
  watch: {
    HousingID: {
      handler(newValue, oldValue) {
        this.FYimgviewType = 1;
        this.LPimg = "";
        this.getAll();
      }
    }
  }
};
</script>
<style scoped lang="scss">
.Properties {
  height: 130px;
}
.PropertiesIMG {
  width: 190px;
  height: 100%;
  float: left;
  border-radius: 10px;
  overflow: hidden;
}
.PropertiesIMG img {
  width: 100%;
  height: 100%;
}
.PropertiesName {
  float: left;
  margin-left: 20px;
}
ul,
li {
  list-style: none;
}
ul {
  padding: 0;
}
.parameter_l {
  width: 50%;
  float: left;
  padding-left: 15px;
}
.parameter_r {
  width: 50%;
  float: right;
  padding-left: 5%;
}
.parameter_ul {
  margin: 0;
}
.parameter_ul li {
  width: 100%;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
}

.parameter_span {
  display: inline-block;
  width: 100px;
  float: left;
}
.Matching_span {
  display: inline-block;
  width: 100px;
  line-height: 34px;
}

.Follow_main {
  .Follow_List {
    ul {
      list-style: none;
      max-height: 606px;
      overflow: auto;
      li {
        margin: 0px 20px;
        border-bottom: 1px solid rgb(240, 240, 240);
        padding: 20px 0px;
        .content_text {
          margin-left: 15px;
          line-height: 30px;
          color: rgb(70, 70, 70);
        }
        .date {
          color: rgb(158, 158, 158);
          line-height: 55px;
        }
      }
    }
  }
}

.LP_imgList {
  width: 100%;
  padding: 0px 10px;
  .el-pagination {
    margin-top: 15px;
  }
}
.LP_imgList ul {
  width: 100%;
  height: 77%;
  overflow: hidden;
  margin: 0;
}
.VideoList ul {
  width: 100%;
  height: 77%;
  overflow: hidden;
  margin: 0;
}
</style>